"use client";
import dynamic from "next/dynamic";
import { useMemo } from "react";

const ReactPlayer = dynamic(() => import("react-player"), { ssr: false });

interface PlayerProps {
  url: string;
}

export default function Player({ url }: PlayerProps) {
  console.log('⏰ ~ Player ~ url:', url)
  if (!url) {
    return (
      <div className="flex aspect-video w-full items-center justify-center rounded-lg border border-dashed border-zinc-300 text-sm text-zinc-500 dark:border-zinc-700 dark:text-zinc-400">
        无可用视频源
      </div>
    );
  }
  return (
    <div className="aspect-video w-full overflow-hidden rounded-lg border border-zinc-200 dark:border-zinc-800">
      <ReactPlayer
        src={url}
        width="100%"
        height="100%"
        controls
        playing={false}
      />
    </div>
  );
}


